import React, { useRef } from 'react'
import { useImperativeHandle } from 'react'
/**
 *  给经过React.forwardRef()处理过的函数组件绑定ref属性后，函数组件的第二个参数，会收到父组件绑定的ref对象
 * 
 */
function FunSon(props, fromFatherRef) {
    const divRef= useRef()
    console.log('FunSon ref: ', fromFatherRef)
    
    useImperativeHandle(fromFatherRef, ()=>{
        return {
            changeColor:()=>{
                divRef.current.style.color = 'red'
            },
            changeSize:()=>{
                divRef.current.style.fontSize = '35px'
            }
        }
    })
    return (
        <div ref={divRef}>函数组件 Son</div>
    )
}
export default React.forwardRef(FunSon)
